<template>
  <div id="main">
    <lay-header />
    <div id="content">
      <div class="movie_menu">
				<router-link tag="div" to="/movie/city" class="city_name">
					<span>{{ $store.state.city.nm }}</span><i class="iconfont icon-lower-triangle"></i>
				</router-link>
				<div class="hot_swtich">
					<router-link tag="div" to="/movie/nowplaying" class="hot_item">正在热映</router-link>
					<router-link tag="div" to="/movie/comingsoon" class="hot_item">即将上映</router-link>
				</div>
				<router-link tag="div" to="/movie/search" class="search_entry">
					<i class="iconfont icon-sousuo"></i>
				</router-link>
			</div>
      <keep-alive>
        <router-view />
      </keep-alive>
    </div>
    <lay-tab /><!-- 页脚的tab -->
    <router-view name="detail"></router-view>
  </div>
</template>

<script>
  import layHeader from '@/components/header'
  import layTab from '@/components/tabbar'
  import { MessageBox } from '@/components/JS'
  import { getCityLocation } from '@/api/api'

  export default {
    name: 'movie',
    mounted() {
      setTimeout(() => {
        getCityLocation().then(res => {
          let resData = res.data
          if (resData.msg === 'ok') {
            let nm = resData.data.nm
            let id = resData.data.id
            if(this.$store.state.city.id === id) return

            MessageBox({
              title: '定位',
              content: nm,
              cancel: '取消',
              ok: '切换定位',
              handleOk() {
                window.localStorage.setItem('nowNm', nm)
                window.localStorage.setItem('nowId', id)
                window.location.reload()
              }
            })
          }
        })
      }, 3000)
    },
    components: {
      layHeader,
      layTab
    }
  }
</script>

<style lang="scss" scoped>

</style>
